<!DOCTYPE html>
<html lang="zh-cmn-Hans">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>鹿程智慧油站商户平台</title>
		<meta name="description" content="鹿程科技是提供加油站互联网化零管系统、营销及支付和大数据分析运营服务的行业领先科技公司。鹿程科技充分了解加油站行业的需求和新兴互联网的发展,依靠业内最先进的科技和标准化的运营,持续帮助油站业务发展创造价值。"/>
		<meta name="keywords" content="智慧油站,鹿程,鹿程智慧油站,鹿程智慧油站微信支付,加油站微信支付,加油站营销管理"/>
		<link rel="icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link rel="shortcut icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<link rel="stylesheet" href="../css/style.css" />
	</head>
<body>
	<section class="section-right">
		<!--deer-tit-->
		<div class="deer-tit">
			<h3>商业智能</h3>
			<h4>仪表盘</h4>
		</div>
		<!--/deer-tit-->
		<!--deer-content-->
		<div class="deer-content">			
			<div class="biz-choosebox layui-form">				
				<dl>
					<dt>选择指标</dt>
					<dd><input type="checkbox" name="switch" lay-skin="switch"  lay-filter="zhibiao"></dd>
				</dl>
			</div>
			
			<div class="biz-title">
			<h6>油品</h6>
			<div class="biz-card"> 
				<div class="biz-zhibiao layui-form">
					 <dl>
				    	<dd>
					      <input type="checkbox" name="lucheng1" value="1" title="当日油品销量">
					      <input type="checkbox" name="lucheng2" value="2" title="当日客单价">
					      <input type="checkbox" name="lucheng3" value="3" title="近30天平均客单价">
					      <input type="checkbox" name="lucheng4" value="4" title="近30天0#柴油客单价">
					      <input type="checkbox" name="lucheng5" value="5" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng6" value="6" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng7" value="7" title="近30天92#汽油客单价">					      
					      <input type="checkbox" name="lucheng5" value="5" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng6" value="6" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng7" value="7" title="近30天92#汽油客单价">					      
					    </dd>
				    </dl>
				</div>
				<dl>
					<dt>当日油品销量</dt>
					<dd>175.77升</dd>
					<dd>周同比<span>-95.09%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>近30天日均油品销量</dt>
					<dd>459.87升</dd>
					<dd>环比<span>238.52%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>当日客单价</dt>
					<dd>189.55升</dd>
					<dd>周同比<span>189.52%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>近30日平均客单价</dt>
					<dd>402.56元</dd>
					<dd>环比<span>77.94%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
			</div>
			</div>
			<div class="biz-title">
			<h6>非油品</h6>
			<div class="biz-card">
				<div class="biz-zhibiao layui-form">
					 <dl>
				    	<dd>
					      <input type="checkbox" name="lucheng1" value="1" title="当日油品销量">
					      <input type="checkbox" name="lucheng2" value="2" title="当日客单价">
					      <input type="checkbox" name="lucheng3" value="3" title="近30天平均客单价">
					      <input type="checkbox" name="lucheng4" value="4" title="近30天0#柴油客单价">
					      <input type="checkbox" name="lucheng5" value="5" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng6" value="6" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng7" value="7" title="近30天92#汽油客单价">					      
					      <input type="checkbox" name="lucheng5" value="5" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng6" value="6" title="近30天92#汽油客单价">
					      <input type="checkbox" name="lucheng7" value="7" title="近30天92#汽油客单价">					      
					    </dd>
				    </dl>
				</div>
				<dl>
					<dt>当日非油品销量</dt>
					<dd>10元</dd>
					<dd>周同比<span>1000%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>近30天日均非油品销量</dt>
					<dd>7105.2元</dd>
					<dd>环比<span>38.52%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>当日非油比</dt>
					<dd>555，5.55元/千升</dd>
					<dd>周同比<span>-1.97%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
				<dl>
					<dt>近30天非油比</dt>
					<dd>555，5.55元/千升</dd>
					<dd>周同比<span>-1.97%</span></dd>
					<i class="fa fa-question-circle fa-2x"></i>
				</dl>
			</div>
			</div>
			<div class="you_sale">
			<h6>当日油品销量</h6>
			<div class="echarts_box" id="main"></div>
			</div>
		<!--/deer-content-->
	</section>
	<!--js-->
		<aside>
			<script type="text/javascript" src="../layui/layui.js" ></script>
			<script type="text/javascript" src="../js/echarts.min.js" ></script>
			<script type="text/javascript">
				layui.use(['form','jquery'],function(){
					var	form=layui.form;
					var $=layui.jquery;	
					
					$(".biz-zhibiao").hide();
					form.on('switch(zhibiao)', function(data){						
							$(".biz-zhibiao").slideToggle();	
					}); 
				  
				})				
				 var myChart = echarts.init(document.getElementById('main'));
				option = {
				    title: {
				        text: '',
				        left:'2%'
				    },
				    tooltip: {
				        trigger: 'axis'
				    },
				    legend: {
				        data:['油品销量']},
				    grid: {
				        left: '3%',
				        right: '3%',
				        bottom: '3%',
				        containLabel: true
				    },
				    toolbox: {
				    	left: '95%',
				        feature: {
				            saveAsImage: {}
				        }
				    },
				    xAxis: {
				        type: 'category',
				        boundaryGap: false,				        						data:[20180301,20180305,20180306,20180307,20180308,20180312,20180313,20180314,20180315,20180316,20180317,20180318,20180319,20180320,20180321,20180322,20180323,20180324,20180326,20180328,20180329]},
				    yAxis: {
                    type : 'value',
                    name:'升'
              		},
				    series: [{
                    name:'油品销量',
                    type:'line',
                    stack: '总量',
                    areaStyle: {normal: {}},
                    data:[39.06,97.65,39.06,14.33,283.85,23.81,654.92,702.54,298.41,1033.64,604.35,1166.67,1127.29,71.43,23.81,3582.39,1547.36,1174.73,314.35,516.9,175.77]                					}]
				 };
				// 使用刚指定的配置项和数据显示图表。
		        myChart.setOption(option);

			</script>
		</aside>
		<!--/js-->
</body>
</html>
